<template>
  <div class="agreementCustomerList">
    <filterPanel filterName="SAgreementCustomerListFilter" filterTitle="协议客户查询" :filterList="filterData"
                 @filterChange="filterChange"></filterPanel>
    <tablePanel tableName="SAgreementCustomerListTable" :tableLoading="loading" tableTitle="协议客户列表"
                :tableList="tableList"
                :tableData="tableData" :total="total" :currentPage="form.page_start" :pageSize="form.page_size"
                @sizeChange="sizeChange" @pageChange="pageChange" @tableClick="tableClick">
      <zy-button type="primary" @click="tableClick('', 'add')">新增</zy-button>
    </tablePanel>
    <zyModel :show="showModel" title="揽件" @submit="submit" @close="closeModel">
      <div class="personalChange">
        <zy-modal-info cellNum="2" :model-info="modelInfo"></zy-modal-info>
      </div>
    </zyModel>
  </div>
</template>

<script>
	export default {
		name: "SAgreementCustomerList",
		props: {},
		data() {
			return {
				filterData: [
					{
						title: '客户名称',
						name: 'company_name',
						type: 'input',
						value: '',
						maxlength: '50',
						isShow: true,
						isSelected: true
					},
					{
						title: '经营类型',
						name: 'bistype',
						type: 'input',
						value: '',
						maxlength: '11',
						isShow: true,
						isSelected: true
					},
					{
						title: '经营期限',
						name: 'bisendtime',
						type: 'date',
						value: [],
						isShow: true,
						isSelected: true
					},
					{
						title: '法人姓名',
						name: 'legalname',
						type: 'input',
						value: '',
						maxlength: '20',
						isShow: true,
						isSelected: true
					},
					{
						title: '法人电话',
						name: 'legalmobile',
						type: 'input',
						value: '',
						maxlength: '11',
						tag: 'mobile',
						isShow: true,
						isSelected: true
					},
					{
						title: '法人身份证',
						name: 'legalcardno',
						type: 'input',
						value: '',
						maxlength: '18',
						isShow: true,
						isSelected: true
					},
					{
						title: '发货员姓名 ',
						name: 'postername',
						type: 'input',
						value: '',
						maxlength: '20',
						isShow: true,
						isSelected: true
					},
					{
						title: '发货员电话',
						name: 'postermobile',
						type: 'input',
						value: '',
						maxlength: '11',
						tag: 'mobile',
						isShow: true,
						isSelected: true
					},
				],
				form: {
					company_name: "",
					bistype: "",
					bisendtime: [],
					legalname: "",
					legalmobile: "",
					legalcardno: "",
					postername: "",
					postermobile: "",
					page_start: 1,
					page_size: 10
				},
				tableData: [],
				tableList: [
					{
						title: '客户名称',
						width: 180,
						name: 'companyname',
						isShow: true,
						isSelected: true
					},
					{
						title: '经营类型',
						width: 120,
						name: 'bistype',
						isShow: true,
						isSelected: true
					},
					{
						title: '经营地址',
						width: 240,
						name: 'address',
						isShow: true,
						isSelected: true
					},
					{
						title: '经营期限',
						width: 360,
						name: 'time',
						isShow: true,
						isSelected: true
					},
					{
						title: '法人姓名',
						width: 120,
						name: 'legalname',
						isShow: true,
						isSelected: true
					},
					{
						title: '法人电话',
						width: 180,
						name: 'legalmobile',
						isShow: true,
						isSelected: true
					},
					{
						title: '法人身份证',
						width: 180,
						name: 'legalcardno',
						isShow: true,
						isSelected: true
					},
					{
						title: '发货员姓名',
						width: 180,
						name: 'postername',
						isShow: true,
						isSelected: true
					},
					{
						title: '发货员电话',
						width: 180,
						name: 'postermobile',
						isShow: true,
						isSelected: true
					},
					{
						title: '操作',
						width: 280,
						name: 'handler',
						fixed: 'right',
						btns: [
							{
								type: 'look',
								name: '详情'
							},
							{
								type: 'edit',
								name: '编辑'
							},
							{
								type: 'package',
								name: '揽件'
							},
							{
								type: 'delete',
								name: '删除',
								btnType: 'danger'
							},
						],
						isSelected: true
					}
				],
				total: 0,
				loading: false,
				showModel: false,
				modelInfo: [
					{
						title: '公司名称',
						name: 'companyName',
						type: 'input',
						value: '',
						maxlength: '50',
						readonly: true,
					},
					{
						title: '收件人名称',
						name: 'receivename',
						type: 'input',
						value: '',
						maxlength: '20',
						titleClass: 'required'
					},
					{
						title: '收件人电话',
						name: 'receivemobile',
						type: 'input',
						maxlength: '11',
						tag: 'mobile',
						value: '',
						titleClass: 'required'
					},
					{
						title: '收件人地址',
						name: 'receiveaddr',
						type: 'input',
						value: '',
						maxlength: '200',
						titleClass: 'required'
					},
					{
						title: '寄件数量',
						name: 'sendsize',
						type: 'input',
						tag: 'number',
						value: '',
						titleClass: 'required'
					},
				],
				customerId: ''
			};
		},
		computed: {
			postData() {
				let data = {
					...this.form,
					pagination: {
						page_start: this.form.page_start,
						page_size: this.form.page_size
					}
				};
				if (this.form.bisendtime && this.form.bisendtime.length > 0) {
					data.bisendtime_start = this.form.bisendtime[0] / 1000;
					data.bisendtime_end = this.form.bisendtime[1] / 1000;
				}
				return data;
			},
		},
		watch: {
			$route: {
				handler() {
					let {isRefresh} = this.$route.query || {};
					if (isRefresh) this.getData();
				},
				deep: true
			}
		},
		components: {},
		methods: {
			sizeChange(val) {
				this.form.page_size = val;
				this.getData()
			},
			pageChange(val) {
				this.form.page_start = val;
				this.getData()
			},
			filterChange(data) {
				this.form = {...this.form, ...data};
				this.getData();
			},
			getData() {
				this.loading = true;
				this.$axios.post(this.$api.listProtocolmember, this.postData).then(res => {
					let {code, msg, data} = res;
					this.loading = false;
					if (code == 200) {
						this.tableData = data.list.filter(item => {
							item.look = true;
							item.edit = true;
							item.package = true;
							item.delete = true;
							item.time = item.bisstarttime_cn + ' - ' + item.bisendtime_cn
							return item;
						});
						this.download_url = data.download_url;

						this.total = data.pagination.total_count || 0;
					} else {
						this.total = 0;
						this.tableData = [];
					}
				})
					.catch(ret => {
						this.loading = false;
						this.$message.error(ret.msg || "服务繁忙，请稍后再试");
					});
			},
			tableClick(data, type) {
				if (type === 'delete') {
					this.$confirm("此操作将永久删除协议客户, 是否继续?", "提示", {
						confirmButtonText: "确定",
						cancelButtonText: "取消",
						type: "warning",
						customClass: 'message',
					}).then(() => {
						this.$axios.post(this.$api.deletePorotocolMember, {
							id: data.id
						}).then(res => {
							if (res.code == 200) {
								this.$message.success("删除成功!");
								this.getData();
							} else {
								this.$message.error(res.msg);
							}
						})
					}).catch(() => {
						this.$message.info("已取消删除");
					});
				} else if (type === 'package') {
					this.showModel = true;
					this.customerId = data.id;
					this.modelInfo[0].value = data.companyname;
				} else {
					this.$toRoutePath({
						path: "/sorting/agreement_customer/detail",
						edit: true,
						query: {
							type: type,
							customerId: data.id
						}
					});
				}
			},
			submit() {
				let postData = {
					pmid: this.customerId
				};
				let tipText = '';
				this.modelInfo.forEach(item => {
					if (item.value) {
						postData[item.name] = item.value;
					} else {
						tipText = `${item.title}不能为空`
					}
				});
				if (tipText) {
					return this.$message.error(tipText);
				}

				this.$axios.post(this.$api.pickProtocolLogistics, {
					...postData
				}).then(res => {
					let {code, msg, data} = res;
					this.loading = false;
					if (code == 200) {
						this.closeModel();
						this.getData();
						this.$message.success(msg);
					} else {
						this.$message.error(msg);
					}
				}).catch(ret => {
					this.$message.error(ret.msg || '服务繁忙，请稍后再试');
				});
			},
			closeModel() {
				this.showModel = false;
				this.modelInfo.forEach(item => {
					item.value = ''
				})
			}
		},
		mounted() {
			this.getData();
		},
		created() {
		}
	}
</script>

<style scoped lang="less" src="@/style/sorting/agreementCustomer/agreementCustomerList/index.less">

</style>
